<template>
	<div class="trainDtais" :style='_fixStyleHeiht($route)' >
		<div class='head_title t-center'>
			<h3> {{lessonInfo.detailsName}}</h3>
			<h5>{{lessonInfo.upperWeek}}</h5>
			<div class='t-left'>
				<p>{{lessonInfo.locationName}}</p>
				{{lessonInfo.rollCallMethod}}
			</div>
			<div>{{infoStartEnd}}</div>
	
		</div>
			<van-grid class='body' :column-num="2">
			<van-grid-item :to="{path:'/lessonCoach',query:{rollCall,coach:1,lessonId,uts:infoStartEnd}}" icon="user-o" text="教练/辅助人员" />
			<van-grid-item icon="award-o" :to="{path:'/lessonCoach',query:{rollCall,lessonId,uts:infoStartEnd}}" text="运动员" />
			<van-grid-item  :to="{path:params?'/barcodeQr':'#',query:{params}}" icon="scan" text="扫描"></van-grid-item>
			<van-grid-item icon="certificate" :to="{path:'/review',query:{rollCall,lessonId,uts:infoStartEnd}}" text="确认/检阅" />

		</van-grid>
	</div>

</template>

<script>
	import {
		parseTime
	} from '@/utils';
	const utilsDay = (60 * 60 * 24 * 1000) * 3;
	export default {
		name: 'index',
		data() {
			return {
				// 处理控件显示的时间格式
				minDate: new Date(new Date().getTime() - utilsDay),
				parseTime,
				maxDate: new Date(new Date().getTime() + utilsDay),
				show: false,
				date: new Date(),
				//upperDate:this.formatDate(new Date()),
			};
		},
		mounted() {
			console.log("va", this)
			this.fetchData()
		},
		updated() {

		},
		computed: {
			params(){
				return this.$store.state.train.params
			},
			rollCall(){
				return this.$store.state.train.rollCall
			},
			infoStartEnd(){
				return this.$store.state.train.infoStartEnd
			},
			lessonInfo() {
				return this.$store.state.train.lessonInfo
			},
			lessonId() {
				return this.$route.query.lessonId
			}
		},
		watch: {
			lessonId(val) {
				this.fetchData(val)
			},
			params(val){
				if(!val){
					this.Toast('只能手动签到')
				}
			}
		},
		methods: {
			fetchData() {
				this.$store.dispatch("train/lessonInfo", {
					lessonId: this.lessonId
				})
			},
			formatDate(dates) {
				return parseTime(dates.date ? dates.date : dates, '{y}-{m}-{d}')
			},
			confirmDate(date) {
				this.date = date
				this.upperDate = this.formatDate(date)
			}


		},

	}
</script>

<style lang='less' la >
	.trainDtais {
		/* height: calc(100vh - 46px); */
		.head_title {
			padding: 12px 25px;
			>*{
				width: 200px;
				margin: auto;
			}
			
			height: 25%;
		}

		.body.van-grid {
			height: 75%;
		}
	}
</style>
